<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false" %>
<%@include file="WEB-INF/head/taglib.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
</head>
<body>
<div class="col-sm-12 col-sm-offset-3">
    <form class="form-horizontal" action="/sys/dologin" method="post">
        <div class="form-group">
            <label for="inputUserName" class="col-sm-1 control-label">用户名</label>
            <div class="col-sm-3">
                <input type="test" name="userName" class="form-control" id="inputUserName" placeholder="ueserName">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-1 control-label">密码</label>
            <div class="col-sm-3">
                <input type="password" name="password" class="form-control" id="inputPassword3" placeholder="Password">
            </div>
        </div>
        <div class="form-group">
            <label for="Phone" class="col-sm-1 control-label">手机号</label>
            <div class="col-sm-2">
                <input type="text" class="form-control" id="Phone" placeholder="PhoneNumber">
            </div>
            <button type="button" id="sendMSG" class="btn btn-info">获取验证码</button>
        </div>
        <div class="form-group">
            <label for="code" class="col-sm-1 control-label">验证码</label>
            <div class="col-sm-2">
                <input type="text" class="form-control" id="code">
            </div>
            <span id="msg"></span>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-1 col-sm-3">
                <button type="submit" id="subBtn" class="btn btn-primary">登录</button>
            </div>
        </div>
    </form>
</div>
<script>
    var times;
    function countDownTime(){
        var num = parseInt($("#sendMSG").text());
        num--;
        if (num==0){
            $("#sendMSG").text("获取验证码");
            $("#sendMSG").removeAttr("disabled");
            clearInterval(times);
        }else {
            $("#sendMSG").text(num);
        }
    }

    $(function () {
        $("#sendMSG").click(function () {
            $.post("/sys/sendMsg/"+$("#Phone").val());
            $(this).text(10).attr("disabled","disabled");
            times = setInterval(countDownTime,1000);
        })

        $("#code").change(function () {
            $.ajax({
                url:"/sys/checkCode",
                type:"post",
                data:"code="+$(this).val(),
                success:function (result) {
                    if (result==1){
                        $("#subBtn").removeAttr("disabled");
                        $("#msg").text("").css("color","red");
                    }else{
                        $("#subBtn").attr("disabled","disabled");
                        $("#msg").text("验证码错误").css("color","red");
                        $(this).val("");
                    }
                }
            })


        })


    })
</script>
</body>
</html>